`
<div class="container" id="div">
        <ul>
            <li>事件机制</li>
        </ul>

    </div>
`

let html = document.documentElement;
let body = document.body;
let div = body.querySelector('div');
let ul = body.querySelector('ul');
let li = body.querySelector('li');
// true事件在捕获阶段执行，false事件在冒泡阶段执行
html.addEventListener('click', callback, true)
body.addEventListener('click', callback, true)
div.addEventListener('click', callback, true)
ul.addEventListener('click', callback, true)
li.addEventListener('click', callback, true)

html.addEventListener('click', callback)
body.addEventListener('click', callback)
div.addEventListener('click', callback)
ul.addEventListener('click', callback)
li.addEventListener('click', callback)

function callback(event) {
    let target = event.currentTarget;
    console.log(target.tagName)
}

